<template>
  <div id="app">
    <router-view/>
  </div>
</template>

<style lang="scss">
  @import "./styles/index.scss"; // global css
  @import "./styles/moleculeCss.scss"; // 分子 css
  @import "./icon/parkfont.scss";
  html {
    height: 100%;
    box-sizing: border-box;
  }
  [v-cloak]{display:none !important;}
  body {
    height: 100%;
    margin: 0;
    padding: 0;
    /*font-family: Avenir, Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB,*/
    /*Microsoft YaHei, Arial, sans-serif;*/
    /*font-family: 微软雅黑,'microsoft yahei',宋体,新宋体,sans-serif;*/
    font-family: "Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,sans-serif;
    font-size: 14px;
    color: #333333;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    -webkit-tap-highlight-color: transparent;
    text-rendering: optimizeLegibility;
    background: #f9f9f9;
  }

  p,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  div,
  ul,
  li {
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }

  ul {
    list-style: none;
  }

  #app {
    height: 100%;
    /*overflow-y: hidden;*/
    /*overflow-x: auto;*/
    min-width: 1024px;
    min-height: 540px;
  }

  *,
  *:before,
  *:after {
    box-sizing: border-box;
  }

  ::-webkit-scrollbar {
    width: 6px;
    height: 10px;
    background: #f5f5f5;
  }

  ::-webkit-scrollbar-corner {
    background-color: transparent;
  }

  ::-webkit-scrollbar-thumb {
    background-color: #cccccc;
    border-radius: 8px;
  }

  ::-webkit-scrollbar-track {
    background-color: transparent;
  }

  .no-padding {
    padding: 0 !important;
  }

  a:focus,
  a:active {
    outline: none;
  }

  a,
  a:focus,
  a:hover {
    cursor: pointer;
    color: inherit;
    text-decoration: none;
  }

  div:focus {
    outline: none;
  }

  :focus {
    //解决element 会出现蓝色边框的问题
    outline: 0;
  }

  .el-image.loading::before {
    content: "";
    background-color: #f5f5f5;
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: -2;
  }

  .el-image.loading::after {
    content: "";
    border-radius: 50%;
    border: solid 2px transparent;
    border-top: solid 2px #777777;
    transform-origin: center;
    position: absolute;
    top: 0;
    left: 0;
    width: 20px;
    height: 20px;
    line-height: 20px;
    right: 0;
    bottom: 0;
    z-index: -1;
    font-size: 20px;
    margin: auto;
    color: #ccc;
    -webkit-animation: rotate-spin 2s infinite linear;
    animation: rotate-spin 2s infinite linear;
    display: block;
  }

  @keyframes rotate-spin {
    0% {
      -webkit-transform: rotate(0);
      transform: rotate(0);
    }

    100% {
      -webkit-transform: rotate(359deg);
      transform: rotate(359deg);
    }
  }
</style>
